.ss-platform-loading {
  /* 动画 */
  @-webkit-keyframes bounceLoader {
    0%, 100%, 40% {-webkit-transform: scaleY(.4)}
    20% {-webkit-transform: scaleY(1)}
  }
  @keyframes bounceLoader {
    0%, 100%, 40% {transform: scaleY(.4);-webkit-transform: scaleY(.4)}
    20% {transform: scaleY(1);-webkit-transform: scaleY(1)}
  }
  /* 加载框 */
  &-wraper {
    position: fixed;width: 100%;height: 100%;top: 0;left: 0;background-color: #34495e;z-index: 1024;color: #4F5357;font-family: Helvetica, "Helvetica Neue", Tahoma, Arial, "Microsoft YaHei", "PingFang SC";font-size: 12px;line-height: 1.28571;font-weight: 400;-webkit-font-smoothing: antialiased;
    opacity: 0;transition: opacity .3s ease-out;
    /*pointer-events: none;*/
    &.hide {display: none}
    .loader-text {width: 200px;height: 40px;text-align: center;position: absolute;top: 50%;left: 50%;margin-left: -100px;margin-top: 30px;color: #fff}
    .pre {
      width: 100px;height: 40px;text-align: center;position: absolute;top: 50%;left: 50%;margin-left: -50px;margin-top: -20px
    }
    .pre {
      .left-bar, .right-bar {width: 6px;height: 40px;background: #fff;position: absolute;border-radius: 4px;top: 0}
      .left-bar {left: 0}
      .left-bar .left-bar-bottom-bar, .left-bar .left-bar-top-bar, .right-bar .right-bar-bottom-bar,
      .right-bar .right-bar-top-bar {width: 20px;height: 6px;background: #fff;position: absolute}
      .left-bar .left-bar-top-bar {border-radius: 2px 2px 10px 2px;left: 1px;top: 0}
      .left-bar .left-bar-bottom-bar {border-radius: 2px 10px 2px 2px;left: 1px;bottom: 0}
      .right-bar .right-bar-top-bar {border-radius: 2px 2px 2px 10px;right: 1px;top: 0}
      .right-bar .right-bar-bottom-bar {border-radius: 10px 2px 2px 2px;right: 1px;bottom: 0}
      .right-bar {right: 0}
      .loader-spinner {
        width: 80px;height: 30px;text-align: center;position: absolute;left: 50%;top: 50%;margin-left: -40px;margin-top: -15px;
        > div {background-color: #fff;height: 100%;width: 6px;margin-left: 2px;display: inline-block;-webkit-animation: bounceLoader 1.2s infinite ease-in-out;animation: bounceLoader 1.2s infinite ease-in-out}
        .ou {-webkit-animation-delay: -1.1s;animation-delay: -1.1s}
        .te {-webkit-animation-delay: -1s;animation-delay: -1s}
        .ar {-webkit-animation-delay: -.9s;animation-delay: -.9s}
        .y {-webkit-animation-delay: -.8s;animation-delay: -.8s}
      }
    }
    &.in {opacity: 1}
    &.complete {
      background-color: transparent; /*rgba(0, 0,0, 0.1)*/
      .pre {
        background-color: rgb(248, 249, 251);box-shadow: 0px 5px 32px 0px rgba(81, 79, 79, 0.21);border-radius: 4px;height: 60px;width: 200px;margin-left: -90px;
        .loader-text, .left-bar, .right-bar {display: none}
        .loader-spinner {
          margin-top: -15px;
          > div {background-color: #F55252}
        }
      }
    }
  }
}
